<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<div class="layer1">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>无标题文档</title>
    
  <style type="text/css">
.layer1 {
	background-color: #39F;
	height: 100px;
	width: 100%;
}
      .layer1-1 {
	           background-color: #39F;
	           height: 100px;
	           width: 50%;
			   float:left;
}
       .layer1-2 {
	           background-color:#0C0;
	           height: 100px;
	           width: 50%;
			   float:left;
}
  .layer2 {
	background-color: #CFF;
	height: 400px;
	width: 100%;
}
     .layer2-1 {
	           background-color:#9FC;
	           height: 200px;
	           width: 100%;
			   float:left;
}

            .layer2-1-1{
	                   background-color:#F90;
	                   height: 200px;
	                   width: 33.3%;
			           float:left;
}
            .layer2-1-2{
	                   background-color:#FCF;
	                   height: 200px;
	                   width: 33.3%;
			           float:left;
}
            .layer2-1-3{
	                   background-color:#FFC;
	                   height: 200px;
	                   width: 33.3%;
			           float:left;
}

     .layer2-2 {
	           background-color:#FC6;
	           height: 200px;
	           width: 100%;
			   float:left;
}
           .layer2-2-1 {
	                  background-color:#9F9;
	                  height: 100px;
	                  width: 100%;
			          float:left;
}  

           .layer2-2-2 {
	                  background-color:#F90;
	                  height: 100px;
	                  width: 100%;
			          float:left;
}  
.clear{clear:both;}
.layer3 {
	background-color:#39F
	
	width: 100%;
	background-color: #39F;
	height: 80px;
}
  </style>
  </head>
    
  <body>
  <div class="layer1">
   <div class="layer1-1"></div>
    <div class="layer1-2"></div>
  </div>
  <div class="layer2">
        <div class="layer2-1">
        <div class="layer2-1-1"></div>
        <div class="layer2-1-2"></div>
        <div class="layer2-1-3"></div>
        </div>
        <div class="layer2-2">
         <div class="layer2-2-1"></div>
         <div class="layer2-2-2"></div>
        </div>
        </div>
        <div class="clear"></div>
  <div class="layer3"></div>
  </body>
  </html>
</div>
